<template>
  <el-row>
    <el-col :span="3" v-for="o in collection" :key="o">
      <el-card :body-style="{ padding: '0px' }"
               style="width: 130px">

        <el-image
          style="width: 300px; height: 100px"
          :src="o.classimage"
          class="image"></el-image>
        <div style="padding: 0px;">
          <div>{{o.usersname}}</div>
          <span>{{o.classname}}</span>
          <div>评分:{{o.score}}分</div>
          <div>{{o.number}}人参与</div>


          <div class="bottom clearfix">
            <el-button type="text" class="button" @click="delCollection(o.id)">删除</el-button>
          </div>

          <!--<div class="bottom clearfix">-->
            <!--<el-button type="text" class="button">进入详情</el-button>-->
          <!--</div>-->

        </div>
      </el-card>
    </el-col>
  </el-row>
</template>

<script>
  import jwtDecode from 'jwt-decode'
    export default {
        name: "collection",
        data(){
          return{
            collection:[],
            decode:{
              user:{}
            },

            user: {
            },
          }
        },
      methods:{
          // 遍历收藏
          allCollection:function () {

            var token = window.localStorage.getItem("userS");
            // console.log(user);
            // alert(u)
            // var u= JSON.parse(user);
            // alert(u);
            // alert(u.user);
           // alert(token)
            const decode = jwtDecode(token);

            this.user=JSON.parse(decode.user);
            console.log(this.user.id)
           // alert(this.user.id)

            this.$axios.get("/lesson/AllLessonByUid?id=" + this.user.id).then(res =>{
              this.collection = res.data.data;
            })
          },
          // 删除此收藏
          delCollection:function (id) {
            this.$axios.post("/lesson/updateClassStatus2?id=" + id).then(res=>{
              alert("删除成功")
              this.allCollection();
            })
          }
      },
      mounted() {
        this.allCollection();
      }


    }
</script>

<style scoped>

</style>
